export function renderer(vnode,container){
    if(typeof vnode.tag === 'string'){
        //dom元素
        mountElement(vnode,container)
    }else if(typeof vnode.tag === 'object'){
        // 组件
        mountComponent(vnode,container)
    }
}
function mountElement(vnode,container){
    const el = document.createElement(vnode.tag)
    for(const key in vnode.props){
        // on开头，说明是事件
        if(/^on/.test(key)){
            el.addEventListener(
                key.substr(2).toLowerCase(),
                vnode.props[key]
            )
        }
    }
    if(typeof vnode.children === 'string'){
        // children是文本，直接渲染文本元素
        el.appendChild(document.createTextNode(vnode.children))
    }else if(Array.isArray(vnode.children)){
        // chidlren是dom,递归
        vnode.children.forEach(child=>{
            renderer(child,el)
        })
    }
}
function mountComponent(vnode,container){
    const subTree = vnode.tag.render()
    // 获取tag中的render函数，得到组件的虚拟dom，递归调用
    renderer(subTree,container)
}